﻿// 12列册格,使用grid布局,只指定父元素样式 grids-n
for i in range(1, 12)
    .grids-{i}
        display: grid
        grid-template-columns: repeat(i, percentage((1 / i)))
// flex布局,册格工具样式定义,可使用其内项目定制册格占比
.grids
    display: flex
    flex-wrap: wrap // 规定项目超过一行时,可以换到下一行
// 均分的册格 n个册格,宽度为1/n
.grid
    flex: 1 1 0
// 12列册格(mixinx) 默认用于手机,移动优先
for i in range(1, 12)
    .grid-{i}
        flex: 0 1 percentage((i / 12))